<template>
	<view>
		<view class="login-body">
			<view class="login-header">
				手持系统
			</view>
			<view class="login-content">
				<u-form :model="dataForm" :rules="rules" ref="uForm" label-width="60">
					<u-form-item label="用户名:" prop="userNo">
						<u-input type="text" v-model="dataForm.userNo" border="surround" placeholder="请输入用户名"/>
					</u-form-item>
					<u-form-item label="密码:" prop="password">
						<u-input type="password" v-model="dataForm.password" border="surround" placeholder="请输入密码"/>
					</u-form-item>
				</u-form>
				<u-button throttleTime="1000" type="primary" shape="circle" @click="login">登录</u-button>
			</view>
		</view>
	</view>
</template>	

<script>
	import request from '@/api/index.js'
	export default {
		data() {
			return {
				dataForm: {
					userNo: '',
					password: ''
				},
				rules: {
					userNo: {
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					},
					password: {
						required: true,
						message: '请填写密码',
						trigger: ['blur', 'change']
					},
				}
			}
		},
		methods: {
			login() {
				this.$refs.uForm.validate().then(()=>{
					if (this.dataForm.userNo === 'admin' && this.dataForm.password == 123) {
						uni.setStorageSync('user', this.dataForm.userNo)
						uni.showToast({
							title: '登录成功',
							icon: 'success',
							duration: 2000 ,//时间
						})
						setTimeout(() => {
							uni.redirectTo({
								url:'/pages/home/index'
							})
						},1000)
					} else {
						uni.showToast({
							title: '用户名密码错误',
							icon: 'error',
							duration: 2000 ,//时间
						})
					}
				})
				
			}
		}
	}
</script>

<style lang="scss">
	.login-body {
		height: 100vh;
		padding-top: 50rpx;
		// background-size: cover;
		.login-header {
			width: 400rpx;
			margin: 0 auto;
			font-size: 60rpx;
			margin-top: 50rpx;
			margin-bottom: 200rpx;
			text-align: center;
		}
		.login-content {
			margin: 0 auto;
			width: 400rpx;
			// height: 180rpx;
			padding: 40rpx;
			background-color: rgba(255, 255, 255, 0.6);
			border: 1px solid #EAE7E7;
			border-radius: 10px;
			box-shadow: 0 10px 10px #B1C1CA;
			uni-button {
				width: 150rpx;
				margin-top: 10px;
			}
		}
	}
</style>
